<template>
	<view >
		
		<!-- 搜索条 -->
		<view class="searchBox">
			<view class="inputBox">
				<view  @click="goSearch()">搜一搜，您会发现更多...</view>
			</view>
			<view class="searchBtn" @click="goSearch()">搜索</view>
		</view>
		
		<view class="grace-title" style="margin-top:5upx;">
			<view class="grace-h5 grace-blod grace-center">- 推荐资源库 -</view>
		</view>
		
		<view class="grace-padding" style="margin-top:-10upx;">
		
			<!-- 推荐专题 -->
			<view class="grace-wrap">
				<navigator class="grace-boxes" v-for="(value,key) in dbData" :key="key" @click="goSearchList(value.nameCn,value.nameEn)">
					<block v-if="value.recommend=='1'">
						<view class="grace-boxes-img">
						<image :src="serverUrl+value.cover" mode="widthFix"></image>
						</view>
						<view class="grace-boxes-text">{{value.nameCn}}</view>
					</block>
				</navigator>
				
				<!-- <navigator class="grace-boxes">
					<view class="grace-boxes-img">
					<image src="/static/boxes-2.png" mode="widthFix"></image>
					</view>
					<view class="grace-boxes-text">电子图书</view>
				</navigator>
				<view class="grace-boxes">
					<view class="grace-boxes-img">
					<image src="/static/boxes-1.png" mode="widthFix"></image>
					</view>
					<view class="grace-boxes-text">会议论文</view>
				</view>
				<navigator class="grace-boxes">
					<view class="grace-boxes-img">
					<image src="/static/boxes-4.png" mode="widthFix"></image>
					</view>
					<view class="grace-boxes-text">专家</view>
				</navigator>
				<view class="grace-boxes">
					<view class="grace-boxes-img">
					<image src="/static/boxes-1.png" mode="widthFix"></image>
					</view>
					<view class="grace-boxes-text">机构</view>
				</view>
				<navigator class="grace-boxes">
					<view class="grace-boxes-img">
					<image src="/static/boxes-2.png" mode="widthFix"></image>
					</view>
					<view class="grace-boxes-text">新闻资讯</view>
				</navigator>
				<view class="grace-boxes">
					<view class="grace-boxes-img">
					<image src="/static/boxes-1.png" mode="widthFix"></image>
					</view>
					<view class="grace-boxes-text">科技报告</view>
				</view>
				<navigator class="grace-boxes">
					<view class="grace-boxes-img">
					<image src="/static/boxes-4.png" mode="widthFix"></image>
					</view>
					<view class="grace-boxes-text">专利</view>
				</navigator> -->
				
			</view>
			
			<view class="grace-title" style="margin-top:5upx;">
				<view class="grace-h5 grace-blod grace-center">- 您感兴趣的资源 -</view>
			</view>
			
			<view class="grace-news-list" style="margin-top:-20upx;">
				<navigator v-for="(value,key) in likesData.data" :key="key" @click="goDetail(key)">
					<view class="grace-news-list-items">
						<image :src="serverUrl+value.cover" class="grace-news-list-img grace-list-imgs-l" mode="widthFix"></image>
						<view class="grace-news-list-title">
							<view class="grace-news-list-title-main">{{value.title}}</view>
							<text class="grace-news-list-title-desc grace-text-overflow">作者：{{value.author}}</text>
							<text class="grace-news-list-title-desc grace-text-overflow">出版社：{{value.cbs}}</text>
							<text class="grace-news-list-title-desc grace-text-overflow summary-text-overflow">{{value.summary}}</text>
						</view>
					</view>
				</navigator>
				
			</view>
			
		</view>
		
	</view>
</template>

<script>
	 
	export default {
		 
		data() {
			return {
				serverUrl : this.serverUrl,
				searchKey : "",
				searchClose : false,
				defaultKeyword: "",
				dbData: [],
				likesData: []
			};
		},
		onLoad() {
			this.init();
			this.getLikesList();
			this.getDbList();
		},
		methods:{
			init() {
				this.defaultKeyword = "搜一搜，您会发现更多...";
			},
			goSearch()  {
				uni.navigateTo({
					url: "/pages/search/index/index",
				})
			},
			goSearchList(searchText,searchExpression)  {
				let obj = {
					searchText: searchText + "(资源库)",
					searchExpression: "$type:" + searchExpression
				}
				uni.navigateTo({
					url: "/pages/search/list/list?obj=" + encodeURIComponent(JSON.stringify(obj))
				})
			},
			goDetail(key) {
				let obj = {
					id: this.likesData.data[key].id,
					title: this.likesData.data[key].title,
					type: this.likesData.data[key].type,
					cover: this.likesData.data[key].cover,
					author: this.likesData.data[key].author,
					create_time_str: this.likesData.data[key].create_time_str
				}
				if(this.likesData.data[key].type=='xwzx') {
					uni.navigateTo({
						url: "/pages/news/detail/detail?id=" + id
					})
				}else {
					uni.navigateTo({
						url: "/pages/search/detail/detail?obj=" + encodeURIComponent(JSON.stringify(obj))
					})
				}
				
			},
			getDbList() {
				var data = {
					// recommend: "1",
					pageNumber: 1,
					pageSize: 100
				};
				uni.request({
					url: this.serverUrl + 'search-api/getDatabase',
					header: {
						"content-type": "application/x-www-form-urlencoded; charset=UTF-8"
					},
					data: data,
					method: "POST",
					success: (r) => {
						// console.log(r);
						if(r.data.code=='000000') {
							// console.log(r.data.data);
							this.dbData = r.data.data;
						}else {
							uni.showToast({
								title: r.data.message
							});
						}
					},
					fail: (data, code) => {
						console.log('fail' + JSON.stringify(data));
					}
				})
			},
			getLikesList() {
				var data = {
					query: "$type:ts AND $title:宗教 AND -$cover:*",
					showFields: "id;title;cover;summary;author;cbs;type;create_time_str",
					pageNum: 1,
					pageSize: 5
				};
				uni.request({
					url: this.serverUrl + 'search-api/search',
					header: {
					"content-type": "application/x-www-form-urlencoded; charset=UTF-8"
					},
					data: data,
					method: "POST",
					success: (r) => {
						//console.log(r);
						if(r.data.code=='000000') {
							// console.log(r.data.data);
							this.likesData = r.data.data;
						}else {
							uni.showToast({
								title: r.data.message
							});
						}
					},
					fail: (data, code) => {
						console.log('fail' + JSON.stringify(data));
					}
				})
			}
			
		}
	}
</script>

<style>
	.searchBox {
		width: 95%;
		background-color: rgb(242, 242, 242);
		padding: 7.5px 2.5%;
		display: flex;
		justify-content: space-between;
	}

	.searchBox .inputBox {
		width: 85%;
		flex-shrink: 1;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.searchBox .searchBtn {
		width: 15%;
		margin: 0 0 0 2%;
		display: flex;
		justify-content: center;
		align-items: center;
		flex-shrink: 0;
		font-size: 14px;
		color: #fff;
		background: linear-gradient(to right, #ff9801, #ff570a);
		border-radius: 30px;
	}

	.searchBox .inputBox view {
		width: 100%;
		height: 30px;
		line-height: 30px;
		font-size: 30upx;
		border: 0;
		border-radius: 30px;
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;
		padding: 0 3%;
		margin: 0;
		background-color: #ffffff;
		color: #6b6b6b;
	}
	.grace-news-list-title-main {
		font-size: 30upx;
	}
	
	.grace-news-list-img{
		width:140upx; 
	}
	.summary-text-overflow {
		overflow: hidden;
		text-overflow:ellipsis;
		white-space: nowrap;
	}
</style>
